<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!-- 引入地址栏图标 -->
  <link rel="shortcut icon" href="/favicon.ico">
  <!-- 引入base样式文件 -->
  <link rel="stylesheet" href="/css/base.css">
  <!-- 引入css样式文件-->
  <link rel="stylesheet" href="/css/detail.css">
  <!-- 引入icon字体图标 -->
  <link rel="stylesheet" href="/lib/font/iconfont.css">
  <!-- 引入bootstrap文件 -->
<link rel="stylesheet" href="/lib/bootstrap-3.4.1-dist/css/bootstrap.css">
  <title>首页-绝地求生周边商城</title>
</head>

<body>
  <!-- 主容器 -->
  <div id="container">
    <!-- 网页头部 -->
    <header>
      
    </header>

    <!-- 网页内容 -->
    <main>
      <!-- 主容器 -->
      <div class="mainWrap container">
        <!-- 面包屑导航 -->
        <div class="detail_nav">
          <a href="#">商城首页</a> > <a href="#">家居日用</a> > <a href="#">T恤</a> > <a class="cur">PUBG-98K警告T恤</a>
        </div>

        <!-- 商品介绍 -->
        <div class="product_intro">
          
        </div>

        <script type="text/html" id="product_det">
        <!-- 商品图片预览板块 -->
        <div class="product_preview">
          <div class="goodsImg">
            <img src="{{image}}" class="zoom-image">
          </div>
          <div class="previewBox">
            {{each photo item}}

            <a href="#" class="curPreview">
              <img src="{{item.url}}" alt="">
            </a>
            
            {{/each}}
            
          </div>
          
          
        </div>
        <!-- 商品规格信息板块 -->
        <div class="product_info">
          <h2 class="pord_name">
            {{title}}
          </h2>
          <div class="pord_price">
            <span class="pord_dispri">￥<strong>{{price}}</strong></span>
            <span class="pord_orpri">￥238.00</span>
          </div>
          <div class="pord_detailbox">
            <div class="pord_sold">
              已售：<span class="soldNum">{{saleNum}}</span>
            </div>
            <div class="pord_totalcom">
              累计评价：<span class="comNum">0</span>
            </div>
            <div class="pord_starbox" style="display:flex;">
              <i class="iconfont icon-pingfen show"></i>
              <i class="iconfont icon-pingfen show"></i>
              <i class="iconfont icon-pingfen"></i>
              <i class="iconfont icon-pingfen"></i>
              <i class="iconfont icon-pingfen"></i>
              <span class="star">2.0</span>
            </div>
          </div>
          <div class="pord_size">
            <span>尺码</span>
            <ul>
              <li class="cursize">S/165</li>
              <li>M/170</li>
              <li>L/175</li>
              <li>XL/175</li>
              <li>XXL/180</li>
            </ul>
          </div>
          <div class="pord_num">
            <span>数量</span>
            <div class="edit">
              <a href="javascript:;" class="reduce">-</a>
              <input type="text" size="2" maxlength="4" limit_num="0" class="input_detail_main_buy_num" value="1">
              <a href="javascript:;" class="plus">+</a>
            </div>
            <div class="pord_stock">
              (还剩23件)
            </div>
          </div>
          <div class="pord_btn">
            <button class="add">加入购物车</button>
            <button class="buy">立即购买</button>
            <button class="collect"><i class="iconfont icon-aixin"></i>收藏</button>
          </div>
        </div>
      
        
      </script>

        <!-- tab选项卡 -->
        <div class="product_tab">
          <div class="tab_nav">
            <!-- 此处修改每个items的curtab选项 -->
            <div class="items curtab">
              商品详情
            </div>
            <div class="items ">
              用户点评(0)
            </div>
            <div class="items ">
              联系商家
            </div>
          </div>
          <div class="tab_content">
            <!-- 此处修改每个content_items的curtab选项 -->
            <div class="content_items curcontent">
              <ul class="parameter">
                <li>
                  <label>商品名称：</label>
                  <span class="par-name">PUBG-98K警告T恤</span>
                </li>
                <li>
                  <label>店铺：</label>
                  <span class="par-name">衍界</span>
                </li>
                <li>
                  <label>上架时间：</label>
                  <span class="par-name">2020-04-07</span>
                </li>
                <li>
                  <label>商品毛重：</label>
                  <span class="par-name">500g</span>
                </li>
                <li>
                  <label>商城：</label>
                  <span class="par-name">绝地求生</span>
                </li>
                <li>
                  <label>周边分类：</label>
                  <span class="par-name">家居日用 /T恤</span>
                </li>
              </ul>
              <div class="detailbox">
                <img src="/images/d1.jpg" alt="">
                <img src="/images/d2.jpg" alt="">
                <img src="/images/d3.jpg" alt="">
                <img src="/images/d4.jpg" alt="">
                <img src="/images/d5.jpg" alt="">
                <img src="/images/d6.jpg" alt="">
                <img src="/images/d7.jpg" alt="">
                <img src="/images/d8.jpg" alt="">
              </div>
            </div>
            <div class="content_items">
              <div class="comment_box">
                <span>玩家综合评分：</span>
                <i class="iconfont icon-pingfen show"></i>
                <i class="iconfont icon-pingfen show"></i>
                <i class="iconfont icon-pingfen"></i>
                <i class="iconfont icon-pingfen"></i>
                <i class="iconfont icon-pingfen"></i>
                <span class="start">0.0</span>
              </div>
            </div>
            <div class="content_items ">
              <div class="contact">
                <p>
                  <i class="iconfont icon-shangjia"></i>
                  商家：<span>衍界</span>
                </p>
                <p>
                  <i class="iconfont icon-tubiao210"></i>
                  商家联系方式
                  <br>
                  <span>电话：18301691795</span>
                  <br>
                  <span>ＱＱ：3431632071</span>
                  <br>
                  <span>微信：无</span>
                </p>
                <p>
                  <i class="iconfont icon-shijian"></i>
                  商家服务时间
                  <br>
                  在线时间：10:00—18：00
                </p>
                <p>
                  <i class="iconfont icon-shangjia"></i>
                  经营者证照信息
                  <br>
                  <button>查看证照信息</button>
                </p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </main>

    <!-- 网页尾部 -->
    <footer>

    </footer>
    
<!-- 回到顶部 -->
  <div class="topnav">
    <a href="#top"><i class="comicon btn-top"></i></a>
  </div>

  
<!-- QQ登陆 -->
<div class="koukou">

  </div>
  <script src="/lib/require/require.js" data-main="/js/detail"></script>
<!-- 加入购物车 -->
<div class="gou">

  <img src="/images/gou.png" alt="">
  ～快去付款吧～
</div>

</body>

</html>